@import 'colors';
@import 'variables';
// Theme colors
$primary-color: $pinkish-orange !default;
$secondary: $default-link !default;
$tertiary: $cool-grey !default;
$light: #e6ecef;
$additional-1: $soft-green !default;
$additional-2: $tip !default;
$additional-3: $dev !default;
$contrast: $charcoal-grey !default;

$button-hover-background-color: #ff7b54 !default;
$button-active-background-color: #e5613a !default;
$button-active-shadow: inset 0 3px 0 0 rgba(0, 0, 0, 0.1);

// Bootstrap overrides
$primary: $primary-color !default;
$danger: #f9777f !default;
$info: $tip !default;
$success: $additional-1 !default;
$warning: $dull-yellow !default;

$state-success-bg: $success;
$state-warning-bg: $warning;
$state-danger-bg: $danger;
$state-info-bg: $info;

$link-color: $dark-link !default;
$link-hover-color: $dark-link !default;
$body-bg: $charcoal-grey !default;
$body-color: $white !default;

$font-family-sans-serif: 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
  'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
  'Segoe UI Emoji', 'Segoe UI Symbol';

// Theme variables

$default-background-color: $slate-grey !default;
$navigation-border: 1px solid #435863 !default;
// Components

// Header
$header-background-color: $default-background-color !default;
$header-border: $navigation-border !default;

// Sidebar
$sidebar-border: $navigation-border !default;
$sidebar-background-color: $slate-grey !default;

// SidebarToggle
$sidebar-toggle-border: $navigation-border !default;
$sidebar-toggle-hover-color: $default-link !default;
$sidebar-toggle-background-color: $default-background-color !default;
$sidebar-toggle-color: $white !default;

// Menu
$menu-background-color: $default-background-color !default;
$menu-item-color: rgba(#fff, 0.5) !default;
$menu-item-selected-color: $white !default;
$menu-top-item-hover-color: $dark-link !default;

// ProfileMenu
$profile-menu-top-item-background-color: $default-background-color !default;
$profile-menu-background-color: $default-background-color !default;
$profile-menu-border: $navigation-border !default;
$profile-menu-toggle-button-color: $white !default;

// PanelMenu
$panel-menu-background-color: $default-background-color !default;
$panel-menu-hover-background-color: #435863 !default;
$panel-menu-item-active-background-color: $panel-menu-hover-background-color !default;
$panel-menu-item-border: solid 1px rgba(#363d40, 0.1) !default;
$panel-menu-icon-color: rgba($charcoal-grey, 0.6) !default;
$panel-menu-item-2nd-level-hover-background-color: #e9eaec !default;
$panel-menu-item-3rd-level-hover-background-color: #dddfe1 !default;
$panel-menu-item-2nd-level-hover-color: $charcoal-grey !default;
$panel-menu-item-3rd-level-hover-color: $charcoal-grey !default;
$panel-menu-item-2nd-level-color: #000 !default

// Card
$card-background-color: $default-background-color !default;

// Steps
$steps-number-color: $greyish-brown !default;

// Accordion
$accordion-item-background-color: $default-background-color !default;
$accordion-selected-color: $dark-link !default;

// Panel
$panel-background-color: $default-background-color !default;
$panel-toggle-icon-background-color: $charcoal-grey !default;
$panel-hover-color: $dark-link !default;

// Input components
$input-background-color: #323f45 !default;
$input-border: 1px solid #2f3a40 !default;
$input-hover-border: 1px solid #2f3a40 !default;
$input-focus-border: 1px solid rgba(71, 156, 200, 0.6) !default;
$input-disabled-border: solid 1px rgba(47, 58, 64, 0.53) !default;
$input-disabled-background-color: rgba(136, 152, 155, 0.06) !default;
$input-disabled-shadow: inset 0 4px 3px 0 rgba(0, 0, 0, 0.03) !default;
$input-disabled-color: #868e96 !default;

// Fieldset
$fieldset-border: 1px solid #242c30 !default;
$fieldset-toggle-background-color: #323f45 !default;

// Dropdown
$dropdown-open-background-color: $default-background-color !default;
$dropdown-open-border: 1px solid #45565d !default;
$dropdown-filter-border: 1px solid rgba($charcoal-grey, 0.2) !default;

// ListBox
$listbox-background-color: $default-background-color !default;
$listbox-filter-border: $dropdown-filter-border !default;
$listbox-border: none !default;

// PickList
$picklist-background-color: rgba(#28363c, 0.5) !default;
$picklist-list-background-color: $default-background-color !default;
$picklist-header-color: $dark-link !default;
$picklist-item-border: none !default;
$picklist-item-background-color: #435863 !default;
$picklist-header-border: 1px solid rgba($charcoal-grey, 0.2) !default;
$picklist-list-border: none !default;
$picklist-droppoint-background-color: $dark-link !default;

// Slider

$slider-border: 1px solid #2f3a40 !default;
$slider-background-color: #323f45 !default;
$slider-range-background-color: $default-background-color !default;
$slider-range-border: 1px solid $default-background-color !default;
$slider-disabled-border: solid 1px rgba(47, 58, 64, 0.53) !default;
$slider-disabled-background-color: #6d787d !default;
$slider-disabled-handle-background-color: $slider-disabled-background-color !default;

// Numeric
$numeric-button-disabled-background-color: rgba($cool-grey, 0.2) !default;

// DatePicker
$datepicker-panel-background-color: $default-background-color !default;
$datepicker-header-background-color: $default-background-color !default;
$datepicker-calendar-border: 1px solid rgba($charcoal-grey, 0.2) !default;
$datepicker-header-border: $datepicker-calendar-border !default;
$datepicker-header-color: $charcoal-grey !default;
$datepicker-panel-border: $input-border !default;
$timepicker-border: 1px solid rgba(47, 58, 64, 0.53) !default;

// Rating
$rating-color: $cool-grey !default;

// Upload
$upload-button-bar-background-color: #2f3d43 !default;
$upload-files-background-color: $default-background-color !default;

// Grid
$grid-header-background-color: #2f3d43 !default;
$grid-header-color: $cool-grey !default;
$grid-cell-border: 1px solid #45565d !default;
$grid-background-color: $default-background-color !default;
$grid-stripe-background-color: #586c75 !default;
$grid-cell-color: $body-color !default;
$grid-hover-background-color: rgba(#45565d, 0.5) !default;
$grid-header-sorted-background-color: rgba(4, 4, 4, 0.1) !default;
$grid-filter-background-color: #4a5a63 !default;
$grid-filter-buttons-background-color: $default-background-color !default;
$grid-border: $grid-cell-border !default;
$grid-toolbar-background-color: $default-background-color !default;
$grid-detail-template-background-color: $default-background-color !default;
$grid-detail-template-border: none !default;

// Paginator
$paginator-background-color: $default-background-color !default;
$paginator-back-button-background-color: $cool-grey !default;
$paginator-numeric-button-background-color: $cool-grey !default;
$paginator-back-button-color: #515f65 !default;
$paginator-numeric-button-color: #515f65 !default;
$paginator-numeric-button-selected-background-color: $charcoal-grey !default;
$paginator-numeric-button-selected-color: $body-color !default;
$paginator-numeric-button-selected-border: 1px solid $charcoal-grey !default;

// Tree
$tree-background-color: $default-background-color !default;
$tree-border: 1px solid $default-background-color !default;

// DataList
$datalist-background-color: $default-background-color !default;
$datalist-item-background-color: $charcoal-grey !default;
$datalist-item-border: none !default;
$datalist-border: $grid-border !default;
$datalist-item-shadow: 0 22px 64px 0 rgba(0, 0, 0, 0.22);

// Scheduler
$scheduler-background-color: $default-background-color !default;
$scheduler-color: $cool-grey !default;
$scheduler-toolbar-background-color: #2f3d43 !default;
$scheduler-header-background-color: #4a5a63 !default;
$scheduler-header-color: $cool-grey !default;
$scheduler-header-border: none !default;
$scheduler-border-color: $cool-grey !default;
$scheduler-border: $grid-border !default;

// Tabs
$tabs-background-color: $default-background-color !default;
$tabs-tab-background-color: #2f3d43 !default;
$tabs-hover-background-color: $tabs-tab-background-color;
$tabs-selected-tab-color: $body-color;
$tabs-tab-color: rgba($body-color, 0.5) !default;
$tabs-border: none !default;

// Dialog
$dialog-background-color: $charcoal-grey !default;
$dialog-title-background-color: #28363c !default;

// Footer
$footer-background-color: $default-background-color !default;
$footer-border: $navigation-border !default;

// Scrollbar
$scrollbar-background-color: $default-background-color !default;
$scrollbar-color: $charcoal-grey !default;

// Login
$login-register-background-color: $default-background-color !default;

// Lookup
$lookup-panel-background-color: $default-background-color !default;

// Overlay
$overlay-border: $input-border !default;

// Steps
$steps-button-color: $cool-grey !default;

// ProgressBar
$progressbar-background-color: $default-background-color !default;

// Chart
$chart-axis-color: rgba(#fff, 0.2);
$chart-axis-label-color: rgba(#fff, 0.5);
$chart-tooltip-background: rgba($default-background-color, 0.95) !default;

// Gauge
$gauge-scale-color: #fff !default;
$gauge-scale-label-color: #fff !default;
$gauge-pointer-color: #fff !default;
$gauge-arc-scale-color: #fff !default;
$gauge-arc-scale-label-color: #fff !default;
$gauge-arc-value-color: $default-link !default;

// Editor
$editor-toolbar-background-color: $default-background-color !default;
$editor-button-background-color: $default-background-color !default;
$editor-button-selected-color: $white !default;
$editor-separator-background-color: $body-color !default;

@import 'fonts';
@import 'typography';
@import 'components';
